<template>
  <view class="flex m-t20" @click="gotoUrl">
    <image class="avatar" :src="avatar" mode="aspectFill" />

    <view class="flex-1 flex-d-lc m-l20">
      <text class="text-700-132">{{ userInfo.nickname }}</text>
      <text class="m-t8 text-400-124">{{ userInfo.work > 0 ? `${userInfo.work}年` : '无经验' }} / {{
        userInfo.highest_education }} / {{ age }}</text>
    </view>
  </view>
</template>

<script lang="ts" setup>
import { computed } from 'vue'
import { useUserStore } from '@/stores/user'
import { genStaticUrl } from '@/utils/utils'

const { userInfo } = useUserStore()

const avatar = computed(() => {
  if (userInfo.avatar.startsWith('/')) {
    return genStaticUrl(userInfo.avatar)
  }

  return userInfo.avatar
})
function gotoUrl() {
  uni.navigateTo({ url: "/pages_site/pages/home/home" })
}
const age = computed(() => {
  let ret = '--'
  try {
    if (userInfo.birthday) {
      const years = Math.floor((Date.now() - Number(new Date(userInfo.birthday))) / (365 * 24 * 60 * 60 * 1000))
      ret = `${years}岁`
    }
  } catch (_) { }

  return ret
})
</script>

<style lang="scss" scoped>
.avatar {
  width: 108rpx;
  height: 108rpx;
  border-radius: 50%;
}
</style>
